// components/plate-input/index.js
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    plateNumber: String,
  },

  /**
   * 组件的初始数据
   */
  data: {
    provinceText: [
      '粤', '京', '冀', '沪', '津', '晋', '辽',
      '吉', '黑', '苏', '浙', '皖', '闽', '赣',
      '鲁', '豫', '鄂', '湘', '桂', '琼', '渝',
      '川', '贵', '云', '藏', '陕', '甘', '青', '宁'],
    numberText: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0'],
    wordText: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'],
    lastWordText: ['港', '澳', '学', '领', '警'],
    plateType: 1,
    currentInputValue: ['', '', '', '', '', '', ''],
    currentInputIndex: 0,
    choiceList: [
      '粤', '京', '冀', '沪', '津', '晋', '辽',
      '吉', '黑', '苏', '浙', '皖', '闽', '赣',
      '鲁', '豫', '鄂', '湘', '桂', '琼', '渝',
      '川', '贵', '云', '藏', '陕', '甘', '青', '宁'],
  },

  /**
   * 组件的方法列表
   */
  methods: {
    typeChange(event) {
      const value = event.detail.value;
      this.reSetChoiceList(0);
      this.setData({
        plateType: parseInt(value),
        currentInputIndex: 0,
        currentInputValue: value === 1 ? ['', '', '', '', '', '', ''] : ['', '', '', '', '', '', '', ''],
      })
    },
    indexSwitch(event) {
      const inputindex = event.currentTarget.dataset.inputindex;
      let index_Int = parseInt(inputindex);
      this.reSetChoiceList(index_Int);
      this.setData({
        currentInputIndex: index_Int,
      })
    },
    choiceItem(event) {
      const { choice } = event.currentTarget.dataset;
      const { currentInputIndex, currentInputValue, plateType } = this.data;
      currentInputValue.splice(currentInputIndex, 1, choice);
      let inputIndex = currentInputIndex;
      if (plateType === 1 && currentInputIndex < 6) {
        inputIndex = currentInputIndex + 1;
      }
      if (plateType === 2 && currentInputIndex < 7) {
        inputIndex = currentInputIndex + 1;
      }
      this.reSetChoiceList(inputIndex);
      this.setData({
        currentInputIndex: inputIndex,
        currentInputValue,
      })
    },
    reSetChoiceList(index) {
      let choiceList = [];
      const { provinceText, numberText, wordText, lastWordText, plateType } = this.data;
      if (index === 0) {
        choiceList = provinceText;
      }
      if (index === 1) {
        choiceList = wordText;
      }
      if (plateType === 1 && index > 1 && index < 6) {
        choiceList = numberText.concat(wordText);
      }
      if (plateType === 2 && index > 1 && index < 7) {
        choiceList = numberText.concat(wordText);
      }
      if ((plateType === 1 && index === 6) || (plateType === 2 && index === 7)) {
        let midList = numberText.concat(wordText);
        choiceList = midList.concat(lastWordText);
      }
      this.setData({
        choiceList
      })
    },
    handleClick(event) {
      const { opttype } = event.currentTarget.dataset;
      const { currentInputIndex, currentInputValue, plateType } = this.data;
      if (opttype === 'cancel') {
        this.triggerEvent('cancel');
      }
      if (opttype === 'delete') {
        currentInputValue.splice(currentInputIndex, 1, '');
        if (currentInputIndex >= 1) {
          this.reSetChoiceList(currentInputIndex - 1);
          this.setData({
            currentInputIndex: currentInputIndex - 1,
            currentInputValue,
          })
        }
      }
      if (opttype === 'submit') {
        const plate = currentInputValue.join('');
        let err = false;
        if (plateType === 1 && plate.length !== 7) {
          err = true;
        }
        if (plateType === 2 && plate.length !== 8) {
          err = true;
        }
        if (err) {
          wx.showToast({
            title: '请输入完整的车牌号码',
            icon: 'none',
            duration: 2000
          })
        } else {
          this.triggerEvent('submit', plate);
        }
      }
    },
  },
  lifetimes: {
    ready() {
      const { plateNumber } = this.data;
      if (plateNumber) {
        const numberList = plateNumber.split('');
        this.setData({
          plateType: numberList.length === 7 ? 1 : 2,
          currentInputValue: numberList,
          currentInputIndex: numberList.length - 1
        })
        this.reSetChoiceList(numberList.length - 1);
      }
    }
  }
})
